<template>
   <div>
    <h1 v-text="msg" ref="title"></h1>
    <button ref="btn" @click="showDom">点我输出上方dom</button>
     <School ref = 'sch'></School>
     <Student></Student>
   </div>
</template>

<script>
import School from './components/School';
import Student from "./components/Student";

export default {
  name: "App",
  data(){
     return {
      msg:'欢迎学习vue'
    }
  },
  methods:{
    showDom(){
      console.log(this.$refs.title);//真实dom元素
      console.log(this.$refs.btn);//真实dom元素
      console.log(this.$refs.sch);//school组件的实例对象(VC)
    }
  },
  //汇总所有的组件
  components:{
    Student,
    School
  }
}
</script>

